<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>抱团商家</title>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no,minimal-ui,viewport-fit=cover"/>
    <meta name="keywords" content="抱团">
    <meta name="description" content="抱团">
    <script type="text/javascript" src="../common/js/base.js" charset="UTF-8"></script>
    <link rel="stylesheet" type="text/css" href="../common/css/elementui.min.css">
    <link rel="stylesheet" type="text/css" href="../common/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="../common/css/nanoscroller.css">
    <link rel="stylesheet" type="text/css" href="../common/css/swiper-bundle.min.css">
    <link rel="stylesheet" type="text/css" href="../common/css/base.css">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <script type='text/javascript' src="../common/js/jquery.min.js" charset="UTF-8"></script>
    <script type='text/javascript' src="../common/js/jquery.easing.js" charset="UTF-8"></script>
    <script type='text/javascript' src="../common/js/html2canvas.min.js" charset="UTF-8"></script>
    <script type="text/javascript" src="../common/js/layer/layer.js" charset="UTF-8"></script>
    <!-- <script type='text/javascript' src="../common/js/createjs.min.js" charset="UTF-8"></script> -->
    <script type="text/javascript" src="../common/js/wow.js" charset="UTF-8"></script>
    <!-- <script type='text/javascript' src="../common/js/city.js" charset="UTF-8"></script> -->
    <script type="text/javascript" src="../common/js/vue.js" charset="UTF-8"></script>
    <script type="text/javascript" src="../common/js/vue-resource.js" charset="UTF-8"></script>
    <script type="text/javascript" src="../common/js/axios.min.js" charset="UTF-8"></script>
    <script type='text/javascript' src="../common/js/elementui.min.js" charset="UTF-8"></script>
    <script type='text/javascript' src="../common/js/jquery.nanoscroller.js" charset="UTF-8"></script>
    <script type='text/javascript' src="../common/js/swiper.animate.min.js" charset="UTF-8"></script>
    <script type='text/javascript' src="../common/js/swiper-bundle.min.js" charset="UTF-8"></script>
    <script type='text/javascript' src="../common/js/helper.js" charset="UTF-8"></script>
</head>
<body>
<div class="wrapperbox changebankcardpage hasmenu" id="app">
    <p class="mine">{{title}}</p>
    <div class="message">
        <div class="cardname">
            <input type="text" v-model="form_data.mobile" placeholder="请输入商户联系人手机号"/>
        </div>
        <div class="cardname">
            <input style="width:4.44rem" type="text" v-model="form_data.sms_code" placeholder="请输入验证码"/>
            <p class="getcode" v-on:click="send">获取验证码</p>
        </div>
        <div class="cardname">
            <input type="text" placeholder="请填写开户人姓名" v-model="form_data.name"/>
        </div>
        <div class="cardname">
            <input type="text" placeholder="请填写卡号" v-model="form_data.card_no"/>
        </div>
        <div class="cardname">
            <input type="text" placeholder="请填写开户银行" v-model="form_data.bank_name"/>
        </div>
        <div class="cardname">
            <input type="text" placeholder="请填写收款银行支行" v-model="form_data.sub_bank"/>
        </div>
        <div class="bottom">
            <div class="tip">{{error}}</div>
            <div class="button" v-on:click="submit">提交</div>
        </div>
    </div>
</div>
</body>
<script>
  $(function () {
    new Vue({
      el: '#app',
      data() {
        return {
          title: '完善银行卡信息',
          form_data: {},
          error: '',
        }
      },
      mounted() {
        wow = new WOW({
          animateClass: 'animated',
          offset: 0
        });
        wow.init();
      },
      created() {
        merchant_get('withdraw_account').then(res => {
          this.form_data = res
          if (res.name) {
            this.title = '修改银行卡信息';
          }
        })
      },
      methods: {
        send: function () {
          this.error = ''
          if (!this.form_data.mobile) {
            this.error = '请输入商户联系人手机号'
            return
          }
          common_post('verify_code', {
            mobile: this.form_data.mobile
          }).then(res => {
            layer.msg('验证码已发送')
          })
        },
        submit: function () {
          if (!this.form_data.mobile) {
            this.error = '请输入商户联系人手机号'
            return
          }
          if (!this.form_data.sms_code) {
            this.error = '请输入验证码'
            return
          }
          if (!this.form_data.name) {
            this.error = '请输入开户人姓名'
            return
          }
          if (!this.form_data.card_no) {
            this.error = '请输入卡号'
            return
          }
          if (!this.form_data.bank_name) {
            this.error = '请输入开户银行'
            return
          }
          if (!this.form_data.sub_bank) {
            this.error = '请输入收款银行运行'
            return
          }
          merchant_post('withdraw_account', {
            mobile: this.form_data.mobile,
            sms_code: this.form_data.sms_code,
            name: this.form_data.name,
            card_no: this.form_data.card_no,
            bank_name: this.form_data.bank_name,
            sub_bank: this.form_data.sub_bank,
          }).then(res => {
            history.back()
          })
        },
      }
    });
  })
</script>
</html>
